<template>
	<view class="item flex flexC bgff mx15 mb12 shadow px10 py12 r10">
<!-- 		<image class="r10 cover" src="/static/logo.jpg" mode="aspectFill"></image> -->
		<view class="flex1 pl8 flexCol flex flexB rightBox ">
			<view class="flex flexC w-20">
				<text class="c33 fs15 bold6 flex1 ellipsis1">{{item.name}}</text>
				<text class="cfa ml22 fs12">待应约</text>
			</view>
			<view class="flex flexC w-20 fs12 c66">
				<view class="flex1 ellipsis1">{{item.shop_name}}</view>
				<text class="ml7">附近{{item.distance}}</text>
			</view>
			<view class="fs12 c66">约战时间：{{item.start_time_txt}}</view>
			<view class="fs12 c66">{{item.mark}}</view>
			<view class="tags fs11 flex flexC pt4 w-20">
				<view class="flex1 mr7">
					<text   class="r3 borf9 mr8 px4 py1">{{item.level}}</text>
					<text   class="r3 borf9 mr8 px4 py1">{{item.table_type}}</text>
					<text   class="r3 borf9 mr8 px4 py1">{{item.type}}</text>
				</view>
				<view v-if="typeStr == 1">
					<text class="r40 fs12 c33 bgfad px12 py4 bold6">电话</text>
					<text class="r40 fs12 c33 bor px12 py4 bold6 ml4">取消</text>
				</view>
				<text v-else class="r40 fs12 c33 bgfad px12 py4 bold6" @click="clickApply(item)">我要应约</text>
			</view>
			
			<view class="tags fs11 flex flexC pt4 w-20">
				<view class="flex1 mr7">
					<image :src="item.avatar" class="logo r20"></image>

				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props: {
			item: {
				type: Object,
				default: {}
			},
			lat: {
				type: [Number, String],
				default: ''
			},
			lng: {
				type: [Number, String],
				default: ''
			},
			typeStr: { // 1:约球记录
				type: [Number, String],
				default: ''
			}
		},
		methods: {
			
			clickApply(item){
				this.$emit("clickApply",item);
			},
			book(item){
				uni.navigateTo({
					url:'../assistant/submit?id='+item.id+"&lat="+this.lat+"&lng="+this.lng
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.item {
		.rightBox {
			height: 268rpx;
			max-width: calc(100%);
		}
		.cover {
			width: 168rpx;
			height: 208rpx;
		}
		.logo {
			width: 68rpx;
			height: 68rpx;
		}
		.bgfad {
			background-color: #FAD00D;
		}
	}
</style>